<%-- 
    Document   : search
    Created on : Dec 2, 2013, 2:34:17 PM
    Author     : lnngu_000
--%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="en">
    <head>
        <title>Catering.com</title>
        <meta charset="utf-8">
        <link rel="stylesheet" href="css/reset.css" type="text/css" media="screen">
        <link rel="stylesheet" href="css/style.css" type="text/css" media="screen">
        <link rel="stylesheet" href="css/layout.css" type="text/css" media="screen">
        <script src="js/jquery-1.7.1.min.js" type="text/javascript"></script>
        <script src="js/cufon-yui.js" type="text/javascript"></script>
        <script src="js/cufon-replace.js" type="text/javascript"></script>
        <script src="js/Dynalight_400.font.js" type="text/javascript"></script>
        <script src="js/FF-cash.js" type="text/javascript"></script>
        <script src="js/tms-0.3.js" type="text/javascript"></script>
        <script src="js/tms_presets.js" type="text/javascript"></script>
        <script src="js/jquery.easing.1.3.js" type="text/javascript"></script>
        <script src="js/jquery.equalheights.js" type="text/javascript"></script>
        <!--[if lt IE 9]><script type="text/javascript" src="js/html5.js"></script><![endif]-->
    </head>
    <body id="page1">
        <!--==============================header=================================-->
        <header>
            <div class="row-top">
                <div class="main">
                    <div class="wrapper">
                        <h1><a href="index.html">Catering<span>.com</span></a></h1>
                        <nav>
                            <ul class="menu">
                                <li><a class="active" href="index.html">About</a></li>
                                <li><a href="menu.html">Login</a></li>
                                <li><a href="faq.html">Registration </a></li>
                                <li><a href="faq.html">FAQ </a></li>
                                <li><a href="contact.html">Contact</a></li>
                            </ul>
                        </nav>
                    </div>
                </div>
            </div>

        </header>
        <!--==============================content================================-->
        <section id="content">
            <div class="main">

                <div class="wrapper">
                    <article class="column-1" style="border: 1px solid #bbb;border-radius: 3px;background: #fbba35;">
                        <div class="indent-left">
                            <div class="maxheight indent-bot">
                                <ul class="list-1">
                                    <h6>Type Of Menu </h6>
                                    <li style="list-style: none;">
                                        <label>

                                            <select style="width: 250px; font-weight: bold;font-size: 20px;">
                                                <option selected> Vegetarian </option>
                                                <option>Non-Veg</option>

                                            </select>
                                        </label>

                                    </li>
                                    <h6>Regional </h6>
                                    <li style="list-style: none;">
                                        <label>

                                            <select onChange="getcbChild();" id="Regional" style="width: 250px; font-weight: bold;font-size: 20px;">

                                                <option value="South" selected>South</option>
                                                <option value="North">North</option>


                                            </select>
                                        </label>

                                    </li>
                                    <h6>Provinces </h6>
                                    <li style="list-style: none;">
                                        <label>

                                            <select id="Provinces" style="width: 250px; font-weight: bold;font-size: 20px;">
                                                

                                            </select>
                                        </label>

                                    </li>
                                    <h6>Location </h6>
                                    <li style="list-style: none;">
                                        <label>

                                            <select style="width: 250px; font-weight: bold;font-size: 20px;">
                                                <option selected> Vegetarian </option>
                                                <option>Non-Veg</option>

                                            </select>
                                        </label>

                                    </li>
                                    <h6>Number of plates </h6>
                                    <li style="list-style: none;">
                                        <label>

                                            <select style="width: 250px; font-weight: bold;font-size: 20px;">

                                                <option value="100" selected>50 to 100</option>
                                                <option value="150">100 to 150</option>
                                                <option value="200">150 to 200</option>
                                                <option value="250">200 to 250</option>
                                                <option value="300">250 to 300</option>
                                                <option value="350">300 to 350</option>
                                                <option value="400">350 to 400</option>
                                                <option value="450">400 to 450</option>
                                                <option value="500">450 to 500</option>
                                                <option value="550">500 to 550</option>
                                                <option value="600">550 to 600</option>
                                                <option value="650">600 to 650</option>
                                                <option value="700">650 to 700</option>
                                                <option value="750">700 to 750</option>
                                                <option value="800">750 to 800</option>
                                                <option value="850">800 to 850</option>
                                                <option value="900">850 to 900</option>
                                                <option value="950">900 to 950</option>
                                                <option value="1000">950 to 1000</option>
                                                <option value="1050">1000 above</option>

                                            </select>
                                        </label>

                                    </li>
                                </ul>
                            </div>
                            <a class="button-1" href="#">Search</a> </div>
                    </article>
                    <article class="column-2">
                        <div class="restaurant-item" data-budget="0" data-open="0">
                            <div class="restaurant-info clearfix">
                                <a class="thumb" href="/4lunch">
                                    
                                    <div class="big" style="background:url('http://eat.vcmedia.vn/thumb/180_180/restaurant/20130807091749_banner1logo.jpg') no-repeat center;">
                                        
                                    </div>
                                   
                                </a>
                                <div class="right-info">
                                    <table style="width: 100%;">
                                        <tr>
                                            <td>4-Lunch</td>
                                            
                                        </tr>
                                        <tr>
                                            <td>18 Phạm Hùng</td>
                                            
                                        </tr>
                                         <tr>
                                            <td>18 Phạm Hùng</td>
                                           
                                        </tr>
                                         <tr>
                                            <td>18 Phạm Hùng</td>
                                           
                                        </tr>
                                         <tr>
                                            <td>18 Phạm Hùng</td>
                                            
                                        </tr>
                                         <tr>
                                            <td>18 Phạm Hùng</td>
                                            
                                        </tr>
                                        
                                    </table>
                                    <a class="button-1" href="#" style="float: right; margin-right: 20px;">View Menu</a> </div>
                                </div>
                            </div>
                        </div>
                    </article>
                </div>
            </div>
        </section>
        <!--==============================footer=================================-->
        <footer>
            <div class="main">
                <div class="aligncenter"> <span>Copyright &copy; <a href="#">Domain Name</a> All Rights Reserved</span> Design by <a target="_blank" href="http://www.templatemonster.com/">TemplateMonster.com</a> </div>
            </div>
        </footer>
<script>
            getcbChild();// mỗi lần Form load thì cho nó chạy cái này để khi đảo lộn vị trí của thằng thành phố thì nó vẫn chạy đúng.
            function getcbChild() {
                var getValue = document.getElementById("Regional").value;
                if (getValue == "South") {
                    document.getElementById("Provinces").innerHTML = '<select name="quanhuyen">'
                            + '<option>quan 7</option>'
                            + '<option>quan 8</option>'
                            + '</select>';
                }
                else if (getValue == "North") {
                    document.getElementById("Provinces").innerHTML = '<select name="quanhuyen">'
                            + '<option >quan 1</option>'
                            + '<option>quan 2</option>'
                            + '<option>quan 3</option>'
                            + '<option>Dong Da</option>'
                            + '<option>Ba Dinh</option>'
                            + '<option>Cau Giay</option></select>';
                }
            }
        </script>
    </body>
</html>
